<template>
	<!-- 复盘 -->
	<view class="content">
		<blueTeethBtn></blueTeethBtn>
		<view class="oneCard">
			<view class="line-view">
				<uni-data-select v-model="formData.id" :localdata="list" placeholder="请选择盘点方案"
					@change="selectChange"></uni-data-select>
			</view>
			<!-- 扫描 -->
			<view class="line-view">
				<uni-easyinput border v-model="formData.code" :focus="canFocusOne" placeholder="扫描仓位"
					@focus="formData.code = ''" @confirm="confirmOne" />

				<uni-easyinput v-model="goodsCode" border :focus="canFocus" placeholder="扫描条码" @focus="goodsCode = ''"
					@confirm="confirmGoods" style="margin-left: 5rpx" />
			</view>
			<view class="line-view" v-if="factoryName" style="font-size: 30rpx; padding-left: 5rpx; color: #777">
				组织名称：{{ factoryName }}
			</view>
			<view class="line-view" v-if="backList.name" style="font-size: 30rpx; padding-left: 5rpx; color: #777">
				仓位名称：{{ backList.name }}
			</view>
			<!-- <u-button type="primary" size="mini" @click="changeModification(index,indexLit)">盘改</u-button> -->
		</view>

		<view style="
        position: sticky;
        top: 0;
        left: 0;
        z-index: 999;
        background-color: #fff;
        padding: 15rpx 25rpx;
      " v-if="formData.id && backList.name">
			<u-subsection :list="tabList" :current="0" active-color="#217EF8" mode="subsection"
				@change="tabChange"></u-subsection>
		</view>

		<u-form label-width="280">
			<view class="flexFull" style="margin-top: 25rpx">
				<view v-for="(item, index) in formModel" :key="index" class="oneCard"
					style="margin-bottom: 40rpx; position: relative">
					<div class="isInventory-view" v-if="item.isReviewInventory == 1">
						已 盘
					</div>
					<u-form-item>
						<view style="margin-left: auto; padding: 15rpx 0">
							<u-button type="primary" size="mini" style="font-size: 28rpx" @click="doPrint(item)">
								打印
							</u-button>
						</view>
					</u-form-item>
					<u-form-item label="物料代码">
						<text style="font-weight: 700">{{ item.productCode }}</text>
					</u-form-item>
					<u-form-item label="物料名称">{{ item.productName }}</u-form-item>
					<u-form-item label="规格型号">{{ item.productModel }}</u-form-item>
					<u-form-item label="批 号">
						{{ item.barcode }}
					</u-form-item>
					<u-form-item label="初盘 / 复盘">
						{{ item.quality }} /
						{{ item.isReviewInventory == 1 ? item.reviewQuality : '--' }}
						<!-- <view style="margin-left: auto">
							<u-button size="mini" style="font-size: 28rpx" @click="changeModification(index)">
								修改
							</u-button>
						</view> -->
					</u-form-item>
					<u-form-item label-width="280" label="初盘 / 复盘辅助数量"  v-if="item.auxUnitId">
						{{ item.auxQuality }} /
						{{ item.isReviewInventory == 1 ? item.reviewAuxQuality : '--' }}
					
					</u-form-item>
					<u-form-item label="">
						<view style="margin-left: auto">
							<u-button size="mini" style="font-size: 28rpx" @click="changeModification(index)">
								修改
							</u-button>
						</view>
					</u-form-item>
				</view>
			</view>
		</u-form>

		<div class="pagination-view">
			<uni-pagination :current="page" :total="totalElements" :show-icon="false" @change="pageChange"
				:pageSize="pageSize" style="width: 720rpx" />
		</div>

		<u-modal v-model="showModel" :show-cancel-button="true" @confirm="confirmChange()" negative-top="350" title="盘点修正">
			<view class="modelBox">
				<u-form ref="uForm" label-width="200">
					<u-form-item label="批号:" label-width="120">
						{{ formChange.barcode }}
					</u-form-item>
					<u-form-item label="初盘数量">
						<view class="innerText">{{ formChange.quality }}</view>
					</u-form-item>
					<u-form-item label="初盘辅助数量" v-if="formChange.auxUnitId">
							<view class="innerText">{{ formChange.auxQuality }}</view>
					</u-form-item>
					<u-form-item label="复盘数量">
						<uni-easyinput v-model="formChange.inputNumber" type="number" focus :inputBorder="false"
							placeholder="输入复盘数量"></uni-easyinput>
					</u-form-item>
					<u-form-item label="复盘辅助数量" :border-bottom="false" v-if="formChange.auxUnitId">
						<uni-easyinput v-model="formChange.inputNumberAux" focus :inputBorder="false"
							placeholder="输入复盘辅助数量"></uni-easyinput>
					</u-form-item>
				</u-form>
			</view>
		</u-modal>
		<u-toast ref="uToast" />
		<u-back-top :scroll-top="scrollTop"></u-back-top>
	</view>
</template>

<script>
	var that;
	import * as bter from '@/components/printCom/bter.js';
	import * as zksdk from '@/components/printCom/bluetoolth.js';
	import blueTeethBtn from '@/components/blueTeethBtn/blueTeethBtn.vue';
	export default {
		components: {
			blueTeethBtn,
		},
		data() {
			return {
				page: 1,
				pageSize: 10,
				totalElements: 0,
				factoryName: null,
				tabIndex: 0,
				tabList: [{
						name: '全部',
					},
					{
						name: '未盘',
					},
					{
						name: '已盘',
					},
				],
				factoryId: null,
				backList: {},
				show: false,
				showModel: false,
				goodsCode: '',
				list: [],
				formData: {
					name: '',
					code: '',
					id: '',
					planMaterialQty: null,
					planBarcodeQty: null,
					size: 5,
				},
				formModel: [],
				formChange: {},
				indexOut: 0,
				indexInner: 0,
				canFocusOne: false,
				scrollTop: 0,
				canFocus: false,
			};
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		onLoad() {
			that = this;
			this.initOptions();
		},
		onShow() {
			if (that.formData.id && that.backList.id) {
				that.confirmOne();
			}
		},
		// onReachBottom() {
		// 	uni.showLoading({
		// 		mask: true,
		// 		title: '加载中...',
		// 	});
		// 	this.pege = this.page++;
		// 	that.getList();
		// },
		onNavigationBarButtonTap() {
			if (!that.formData.id) {
				this.$refs.uToast.show({
					title: '请选择盘点方案',
					type: 'error',
				});
				return false;
			}

			if (!that.backList.name) {
				this.$refs.uToast.show({
					title: '请扫描仓位',
					type: 'error',
				});
				return false;
			}
			uni.navigateTo({
				url: 'addTakeStock?inventoryPlanId=' +
					that.formData.id +
					'&factoryId=' +
					that.factoryId +
					'&stockPositionId=' +
					that.backList.id +
					'&type=replay',
			});
		},
		methods: {
			doPrint(e) {
				uni.showModal({
					title: '提示',
					content: '是否打印此条数据？',
					success: function(res) {
						that.writeBLECharacteristicValue(e);
					},
				});
			},

			// 发送二进制数据
			writeBLECharacteristicValue(obj) {
				// obj = {
				//   stackCode: '202310080002', //堆码
				//   projectNumber: 'YD230928', //项目号
				//   materialCode: 'SEW007812112', // 图号
				//   materialName: '立柱焊接T909L.2.11.2', //物料名称
				// };
				let deviceId = getApp().globalData.deviceId;
				if (!deviceId) {
					uni.showToast({
						icon: 'none',
						title: '缺少设备Id,请去蓝牙页面设置',
					});
					return;
				}
				let strCmd = zksdk.CreatCPCLPage(576, 400, 1, 0);
				strCmd += zksdk.addCPCLQRCode(340, 20, 'Q', 2, 7, obj.barcode);
				strCmd += zksdk.addCPCLText(80, 20, '7', '2', 0, obj.barcode);
				strCmd += zksdk.addCPCLText(10, 80, '7', '2', 0, '编号:');
				strCmd += zksdk.addCPCLText(100, 80, '7', '2', 0, obj.productCode);
				strCmd += zksdk.addCPCLText(10, 150, '7', '2', 0, '单位:');
				strCmd += zksdk.addCPCLText(100, 150, '7', '2', 0, obj.productUnitName);
				strCmd += zksdk.addCPCLText(10, 220, '7', '2', 0, '名称:');
				strCmd += zksdk.addCPCLText(100, 220, '7', '2', 0, obj.productName);
				strCmd += zksdk.addCPCLText(10, 290, '7', '2', 0, '规格:');
				strCmd += zksdk.addCPCLText(100, 290, '7', '2', 0, obj.productModel);
				strCmd += zksdk.addCPCLGAP();
				strCmd += zksdk.addCPCLPrint();
				bter.BTER.printSomething(strCmd);
			},
			pageChange(e) {
				uni.showLoading({
					mask: true,
					title: '加载中...',
				});
				that.page = e.current;
				that.getList();
			},
			tabChange(e) {
				that.tabIndex = e;
				// 0全部 1未 2已
				that.page = 1;
				that.formModel = [];
				uni.showLoading({
					mask: true,
					title: '加载中...',
				});
				that.getList();
			},
			getList() {
				var param = {};
				param.planStatus = that.tabIndex;
				param.inventoryPlanId = that.formData.id;
				param.stockPositionId = this.backList.id;
				param.page = that.page - 1;
				param.barcode = that.goodsCode;
				param.size = that.pageSize;
				param.sort = 'create_time,desc';
				this.$u
					.get('/wms/mobile/api/queryAllByReviewPlanStatus', param)
					.then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								title: res.message,
								type: 'error',
							});
							return;
						}
						that.formModel = res.data.content;
						that.totalElements = res.data.totalElements;
						uni.pageScrollTo({
							scrollTop: 0,
							duration: 0,
						});
						that.canFocus = false;
						setTimeout(function() {
							that.$nextTick(function() {
								that.canFocus = true;
							});
						}, 100);
					});
			},
			subAll() {
				let listClone = JSON.parse(JSON.stringify(this.formModel));
				this.$u
					.post('/wms/mobile/api/updateInventoryPlanBill', {
						id: this.formData.id,
						inventoryPlanBillSaveRequests: listClone,
					})
					.then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								title: res.message,
								type: 'error',
							});
							return;
						}
						this.$refs.uToast.show({
							title: '盘点成功！',
							type: 'success',
							callback: () => {
								// uni.navigateBack({
								// 	delta: 1
								// });
								that.formModel = [];
								that.canFocus = true;
							},
						});
					});
			},
			initOptions() {
				this.$u.get('/wms/mobile/api/getInventoryPlans', {}).then((res) => {
					if (res.code != 0) {
						this.$refs.uToast.show({
							title: res.message,
							type: 'error',
						});
						return;
					}
					let list = res.data;
					for (let item of list) {
						item.value = item.id;
						item.text = item.name;
					}
					this.list = list;
				});
			},
			changeModification(index, indexLit) {
				uni.showLoading({
					mask: true,
					title: '加载中...',
				});
				this.indexOut = index;
				this.indexInner = indexLit;
				this.formChange = JSON.parse(JSON.stringify(this.formModel[index]));
				this.formChange.inputNumber = null;
				this.formChange.inputNumberAux = null;
				uni.hideLoading();
				this.showModel = true;
			},
			confirmChange() {
				uni.showLoading({
					mask: true,
					title: '请稍后...',
				});
				var formChange = JSON.parse(JSON.stringify(this.formChange));
				formChange.reviewQuality = formChange.inputNumber;
				formChange.reviewAuxQuality = formChange.inputNumberAux;
				let obj = {
					productCode: JSON.parse(JSON.stringify(formChange.productCode)),
					productModel: JSON.parse(JSON.stringify(formChange.productModel)),
					productName: JSON.parse(JSON.stringify(formChange.productName)),
					productList: [JSON.parse(JSON.stringify(formChange))],
					totalNum: 0,
				};
				console.log(obj);
				this.$u
					.post('/wms/mobile/api/updateReviewInventoryPlanBill', {
						id: this.formData.id,
						inventoryPlanBillSaveRequests: [obj],
					})
					.then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								title: res.message,
								type: 'error',
							});
							return;
						}
						uni.showToast({
							mask: true,
							icon: 'none',
							title: '提交成功',
						});
						setTimeout(function() {
							that.formModel = [];
							that.page = 1;
							uni.showLoading({
								mask: true,
								title: '请稍后...',
							});
							that.getList();
						}, 1000);
					});
			},
			confirmSelect(e) {
				let obj = e[0];
				this.formData.name = obj.label;
				this.formData.id = obj.value;
				this.$u
					.get('/wms/mobile/api/getInventoryPlanQty', {
						id: obj.value,
					})
					.then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								title: res.message,
								type: 'error',
							});
							return;
						}
						this.formData.planMaterialQty = res.data.planMaterialQty;
						this.formData.planBarcodeQty = res.data.planBarcodeQty;
					});

				this.canFocusOne = true;
			},
			// 扫描仓位
			confirmOne() {
				that.formModel = [];
				that.page = 1;
				that.goodsCode = null;
				if (!that.formData.id) {
					that.formData.code = null;
					that.$u.toast('请选择盘点方案');
					return false;
				}
				this.$u
					.post('/wms/mobile/api/stockPalaceInfoByInventoryPlan', this.formData)
					.then((res) => {
						if (res.code != 0) {
							this.$refs.uToast.show({
								title: res.message,
								type: 'error',
							});
							that.canFocusOne = false;
							setTimeout(function() {
								that.$nextTick(function() {
									that.canFocusOne = true;
								});
							}, 100);
							return false;
						}
						this.backList = res.data;
						uni.showLoading({
							mask: true,
							title: '加载中...',
						});
						that.getList();
					})
					.catch((err) => {
						that.canFocusOne = false;
						setTimeout(function() {
							that.$nextTick(function() {
								that.canFocusOne = true;
							});
						}, 100);
					});
			},
			selectChange(e) {
				console.log(e);
				if (e != that.formData.id) {
					that.page = 1;
					that.formModel = [];
					that.formData.code = null;
					that.backList = {};
					for (let item of this.list) {
						if (item.id == e) {
							that.factoryId = item.factoryId;
							that.factoryName = item.factoryName;
							that.formData.factoryId = item.factoryId;
						}
					}
				}
			},
			confirmGoods() {
				if (!that.formData.id) {
					that.goodsCode = null;
					that.$u.toast('请选择盘点方案');
					return false;
				}
				if (!this.goodsCode) {
					return false;
				}
				that.page = 1;
				that.formModel = [];
				that.getList();
			},
		},
	};
</script>

<style lang="scss">
	page {
		background-color: #f8f8f8;
	}

	.content {
		height: 100%;
	}

	.oneCard {
		padding: 0 25rpx 25rpx 25rpx;
		padding-bottom: 0;
		border-radius: 10rpx;
		background-color: #fff;
	}

	.u-form-item {
		padding: 0 !important;
	}

	.btnRow {
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.oneLit {
		padding: 0 0 0 20rpx;
	}

	.modelBox {
		padding: 0 20rpx;
	}

	.innerText {
		padding-left: 10px;
		font-size: 40rpx;
	}

	.formStyle {
		display: flex;
		flex-flow: column;
		height: calc(100% - 80rpx);
	}

	.flexFull {
		flex: 1;
		overflow-y: auto;
	}

	/deep/.u-form-item__body {
		align-items: flex-start;
	}

	.isInventory-view {
		position: absolute;
		top: 90rpx;
		right: 20rpx;
		transform: rotate(20deg);
		opacity: 0.3;
		font-size: 60rpx;
		font-weight: 700;
		color: #248211;
	}
</style>